<ion-header>
    <ion-navbar>
        <ion-title>
            注干剂管理
        </ion-title>
    </ion-navbar>
</ion-header>

<ion-content id="dry">
    <ion-card>
        <ion-label>现有缓存条数: {{cacheLength}} 条</ion-label>
    </ion-card>
    <ion-card>
        <ion-card-content>
            <h2 id="device">设　备　管　理</h2>
            <hr id="line1" />
        <div id="ID">
            <ion-item id="one">
                <ion-label>设备ID：</ion-label>
                <ion-input style="font-size: 80%; margin-left:-5%;"  placeholder="请点击扫描按钮" disabled="true" [(ngModel)]="deviceId" (ionChange)="deviceIdInput()"></ion-input>
            </ion-item>
            <button id="saomiao" ion-button (click)="scan()">扫码</button>
        </div>
        <div id="NUM">
            <ion-item id="two">
                <ion-label>设备编号：</ion-label>
                <ion-input [(ngModel)]="deviceSerial" (ionChange)="deviceSerialInput()"></ion-input>
                <ion-icon name="search"></ion-icon>
            </ion-item>
            <button id="bangding" disabled="true" ion-button  (click)="bindNewId()">绑定</button>
        </div>
        </ion-card-content>
    </ion-card>

    <ion-card>
        <ion-card-content>
            <h2 id="info">维　护　信　息</h2>
            <hr id="line2" />
            <div id="jingwei">
                <ion-item>
                    <ion-label>经度:</ion-label>
                    <ion-input style="font-size: 86%; margin-left:-10%;" disabled="true" [(ngModel)]="longtitude"></ion-input>
                </ion-item>
                <ion-item>
                    <ion-label>纬度:</ion-label>
                    <ion-input style="font-size: 86%; margin-left:-10%;" disabled="true" [(ngModel)]="latitude"></ion-input>
                </ion-item>
            </div>
            <div id="haiba">
                <ion-item>
                    <ion-label>海拔:</ion-label>
                    <ion-input style="font-size: 86%; margin-left:-10%;" disabled="true" [(ngModel)]="altitude"></ion-input>
                </ion-item>
                <ion-item>
                    <ion-label>精度:</ion-label>
                    <ion-input style="font-size: 86%; margin-left:-10%;" disabled="true" [(ngModel)]="accuracy"></ion-input>
                </ion-item>
             </div>
             
            <ion-item id="status">
                <ion-label>树木状态：</ion-label>
                <ion-select [(ngModel)]="woodStatusValue" cancelText="取消" okText="确定">
                    <ion-option *ngFor="let user of woodStatus" value="{{user.id}}">{{user.name}}</ion-option>
                </ion-select>
            </ion-item>
            <ion-item id="chestDiameter">
                <ion-label>胸径(cm):</ion-label>
                <ion-input type="number" pattern="[0-9]*" [(ngModel)]="chestDiameter"></ion-input>
            </ion-item>
            <ion-item id="injectName">
                <ion-label>注剂类型：</ion-label>
                <ion-select [(ngModel)]="injectNameValue" cancelText="取消" okText="确定">
                    <ion-option *ngFor="let user of injectName" value="{{user.id}}">{{user.name}}</ion-option>
                </ion-select>
            </ion-item>
            <ion-item id="number">
                <ion-label>注剂数量:</ion-label>
                <ion-input style="line-height:normal;" type="number" pattern="[0-9]*" [(ngModel)]="injectNum"  placeholder="请输入整数"></ion-input>
            </ion-item>
            <ion-item id="workcontent">
                <ion-label>工作内容:</ion-label>
                <ion-select [(ngModel)]="workContentValue" cancelText="取消" okText="确定" >
                    <ion-option *ngFor="let user of workContent" value="{{user.id}}">{{user.name}}</ion-option>
                </ion-select>
            </ion-item>
            <ion-item id="remarks"> 
                <ion-label>备注:</ion-label>
                <ion-input [(ngModel)]="remarks"></ion-input>
            </ion-item>
        </ion-card-content>
    </ion-card>

    <div id="photoANDsubmit">
        <button id="paizhao" ion-button (click)="takePhoto()">
            <ion-label>拍照</ion-label>
        </button>

        <button id="tijiao" ion-button [disabled]="isDisabled" (click)="submit()">
            <ion-label>提交</ion-label>
        </button>
    </div>
    <div id="mapANDquery">
        <button id="ditu" ion-button  (click)="NavToMap()">
            <ion-label>地图查看</ion-label>
        </button>

        <button id="chaxun" ion-button  (click)="NavToQuery()">
            <ion-label>查询</ion-label>
        </button>

                <!-- <button id="chaxun" ion-button (click)="test2()">
                    <ion-label>清除数据</ion-label>
                </button> -->

        <!-- <button id="chaxun" ion-button  (click)="test()">
            <ion-label>测试1000条</ion-label>
        </button> -->
    </div>

</ion-content>
